<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <link href="https://cdn.bootcss.com/twitter-bootstrap/3.0.1/css/bootstrap.min.css" rel="stylesheet">
    </head>
    <body>


        <div class="container">
            <div class="row clearfix">
                <div class="col-md-12 column">
                    <form id="form" action="/account/list" method="post">
                    <h1 class="text-center">
                        进出账管理
                    </h1>
                    <h3 class="text-right text-success">
                        欢迎您:管理员
                        <#--<@shiro.principal property="name" />-->
                    </h3>


                        <div class="form-group">
                            <div class="col-sm-2">
                                <button type="button" class="btn btn-default btn-block"
                                        value="" style="background-color: cornflowerblue;font-size: large"
                                >筛选查询</button>
                            </div>
                        </div>

                    <div class="col-sm-offset-11 col-sm-0">
                        <button type="submit" class="btn btn-success"
                                <#--onclick="accountSubmit()"-->
                        style="margin-bottom: 10px">查询</button>
                    </div>
                    <div class="col-md-4 column">
                        <label for="itemId" class="col-sm-2 control-label">记账事项</label>
                        <div class="col-sm-10">
                            <select name="itemId" class="form-control" id="accountItem">
                                <option value="0">请选择菜单</option>
                                <#if itemList?exists>
                                    <#list itemList as item>
                                        <option value="${item.id?if_exists}"
                                            <#if  (accountForm.itemId??)>
                                                <#if item.id==accountForm.itemId>selected</#if>
                                            </#if>

                                        >${item.content}</option>
                                    <#--<option value="${model.id?if_exists}" <#if menu.parentId== model.id>selected</#if>>${model.name}</option>-->
                                    </#list>
                                </#if>
                            </select>
                        </div>
                    </div>


                    <div class="col-md-4 column">
                        <label for="contact" class="col-sm-2 control-label">关系人</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="contact"
                                   name="contact" value="${accountForm.contact?if_exists}"/>
                        </div>
                    </div>

                    <div class="col-md-4 column">
                        <label for="accountState" class="col-sm-2 control-label">进/出账</label>
                        <div class="col-sm-10">
                            <select name="accountState" class="form-control" id="accountState">
                                <option value="-1">请选择菜单</option>
                                <option value="1"
                                        <#if  (accountForm.accountState??)>
                                            <#if accountForm.accountState==1>selected</#if>
                                        </#if>
                                        >进账</option>
                                <option value="0"
                                        <#if  (accountForm.accountState??)>
                                            <#if accountForm.accountState==0>selected</#if>
                                        </#if>
                                >出账</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-4 column">
                        <label for="beginDate" class="col-sm-2 control-label">开始日期</label>
                        <div class="col-sm-10">
                            <input type="date" class="form-control" id="beginDate"
                                   name="beginDate"
                                    <#if  (accountForm.beginDate??)>
                                        value="${accountForm.beginDate?string('yyyy-MM-dd')}"
                                    </#if>
                                   />
                        </div>
                    </div>
                    <div class="col-md-4 column">
                        <label for="endDate" class="col-sm-2 control-label">结束日期</label>
                        <div class="col-sm-10">
                            <input type="date" class="form-control" id="endDate"
                                   name="endDate"
                                    <#if  (accountForm.endDate??)>
                                value="${accountForm.endDate?string('yyyy-MM-dd')}"
                                   </#if>/>
                        </div>
                    </div>
                        <div class="col-md-4 column">

                        </div>

                    </form>

                </div>
            </div>
        </div>


        <div class="container">
            <div class="row clearfix">
                <div class="col-md-12 column">

                    <div class="form-group">
                        <div class="col-sm-2">
                            <button type="button" class="btn btn-default btn-block"
                                    value="" style="background-color: cornflowerblue;font-size: large"
                            >数据列表</button>
                        </div>
                    </div>

        <div class="col-sm-offset-9 col-sm-0" >
            <button type="button" class="btn btn-success"
                    onclick="location.href='/account/add-ui'"
                    style="margin-bottom: 10px">记流水账</button>
            <button type="button" class="btn btn-success"
                    onclick="exportData()"
                    style="margin-bottom: 10px">导出</button>
            <button type="button" class="btn btn-danger"
                    onclick="accountSubmit()"
                    style="margin-bottom: 10px">删除选中</button>
        </div>

                </div>
            </div>
        </div>
        <table class="table">
            <form id="checkBoxform" action="" method="post">
            <thead>
            <tr>
                <th><input type="checkbox" id="checked" onclick="selectedAll()"></th>
                <th>记账事项</th>
                <th>业务日期</th>
                <th>关系人</th>
                <th>往来单位</th>
                <th>事由</th>
                <th>进账</th>
                <th>出账</th>
                <th>记录人</th>
                <th>记录时间</th>
                <th>相关车辆</th>
                <th>审核</th>
                <th>交易确认</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <#--                    c:forEach items='${pageInfo.list}'  var='trip'-->
            <#list pageInfo.list as account>
                <tr class="info">
                    <td><input type="checkbox" name="aid" value="${account.aid}"></td>
                    <td>${account.itemName}</td>
                    <td>
                        ${account.operationDate?string('yyyy-MM-dd')}
                        <#--                                ${trip.startDate?string('yyyy-MM-dd')time} 展示年月日时分秒-->
                        <#--                                ${trip.startDate?time} 展示时分秒-->
                    </td>
                    <td>${account.contact}</td>
                    <td>${account.company}</td>
                    <td>${account.reason}</td>
                    <#if  (account.accountState??)>
                        <#if account.accountState==1><td>${account.money?c}</td>
                        <#elseif account.accountState==0><td></td></#if>
                    </#if>

                    <#if  (account.accountState??)>
                        <#if account.accountState==0><td>${account.money?c}</td>
                        <#elseif account.accountState==1><td></td></#if>
                    </#if>
                    <td>${account.recorder}</td>
                    <td>
                        ${account.recordeTime?string('yyyy-MM-dd')}
                        <#--                                ${trip.startDate?string('yyyy-MM-dd')time} 展示年月日时分秒-->
                        <#--                                ${trip.startDate?time} 展示时分秒-->
                    </td>
                    <td>${account.car}</td>
                    <td>${account.checkState}</td>
                    <td>${account.tradeState}</td>
                    <#--<td>-->
                    <#--<img style="width: 100px;height: 100px;" src="${trip.tripPic}" />-->
                    <#--</td>-->
                    <td>

                        <button type="button" class="btn btn-info"
                                onclick="location.href='/account/edit-ui?aid=${account.aid}'">编辑</button>
                        <button type="button" class="btn btn-default btn-danger"
                                onclick="deleteOne(${account.aid},this)">删除</button>

                        <#if account.checkState=="未审核" >
                            <button type="button" class="btn btn-default btn-warning"
                                    onclick="checkState(${account.aid})">审核</button>
                        </#if>
                        <#if account.tradeState=="未确认" >
                            <button type="button" class="btn btn-default btn-success"
                                    onclick="tradeState(${account.aid})">确认</button>
                        </#if>


                    </td>
                </tr>
            </#list>

            </tbody>
        </table>

        <ul class="pagination" style="float: right">


            <#if pageInfo.hasPreviousPage >
                <li>
                    <a href="javascript:;" onclick="location.href='/account/list?index=1'">首页</a>
                </li>

                <li>
                    <a href="javascript:;" onclick="location.href='/account/list?index=${pageInfo.prePage}'">上一页</a>
                </li>
            </#if>


            <#if pageInfo.pageNum lt pageInfo.pages >
                <li>
                    <a href="javascript:;" onclick="location.href='/account/list?index=${pageInfo.nextPage}'">下一页</a>
                </li>
                <li>
                    <a href="javascript:;" onclick="location.href='/account/list?index=${pageInfo.pages}'">尾页</a>
                </li>
            </#if>
        </ul>
        </form>

        <script src="/static/js/jquery-1.8.0.min.js" ></script>
        <script>
            //执行批量删除，设置鉴别字段method为delete
            function deleteByIds() {
                document.getElementById("method").value="delete";
                document.getElementById("checkBoxform").submit();
            }
            //执行数据导出,设置鉴别字段method为export
            function exportData() {
                document.getElementById("method").value="export";
                document.getElementById("checkBoxform").submit();
            }


            //全选/反选
            function selectedAll() {
                var allsel = document.getElementsByName("aid");/* uid为复选框的name属性值 */
                for ( var i = 0; i < allsel.length; i++) {
                    allsel[i].checked = !allsel[i].checked;
                }
            }

            // 删除账目信息
            function deleteOne(aid,obj){
                if (confirm("您确定删除该条账目信息吗？")) {
                    //发送ajax请求到后台,并传递全部的参数.
                    $.getJSON(
                        "/account/delete?aid=" + aid,
                        null,
                        function (result) {
                            if (result.code == 0) {
                                $(obj).parent().parent().remove();
                            }else {
                                alert(result.msg)
                            }
                        }
                    );
                }
            }

            //审核账目信息
            function checkState(aid) {
                //发送ajax请求到后台,并传递全部的参数.
                $.getJSON(
                    "/account/check?aid=" + aid,
                    null,
                    function (result) {
                        if (result.code == 0) {
                            alert(result.msg)
                            location.href = "/account/list";
                        }else {
                            alert(result.msg)
                        }
                    }
                );
            }

            //确认账目信息
            function tradeState(aid) {
                //发送ajax请求到后台,并传递全部的参数.
                $.getJSON(
                    "/account/affirm?aid=" + aid,
                    null,
                    function (result) {
                        if (result.code == 0) {
                            alert(result.msg)
                            location.href = "/account/list";
                        }else {
                            alert(result.msg)
                        }
                    }
                );
            }
        </script>
    </body>
</html>